<%--
  Created by IntelliJ IDEA.
  User: 18042986105
  Date: 2021/5/22
  Time: 9:46
  To change this template use File | Settings | File Templates.
--%>

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<html>
<head>
    <title>Title</title>


</head>
<style type="text/css">
    body{
        padding:0;
        margin:0;
    }
    .div1{
        width:100%;

    }
    .form{
        display: block;
        width:500px;
        height:400px;
        margin:0 auto;
        margin-top:80px;

    }

   .form_div{
       margin:10px auto;
       width:480px;
       height:34px;


    }
    .form_div label{
        float:left;
        width:20%;
    }
   .input{

       width:70%;
       float:left;
       height:34px;
       margin-left:20%;
   }

   .input input{
       display:block;
       margin:0 auto;
       width:80%;
       height:34px;

   }
   .input input.yzm{
       float:left;
       width:50%;
       height:34px;
       margin-left:50px;
   }
    .nav1{
        height:80px;
        width:100%;
        background-color:#8D1111;
    }
    .nav1 img{
        display:block;
        margin-left:100px;

    }

    #yzm{
        height:34px;
        width:200px;
    }

    .form_div #sub{
        display:block;
        width:45%;
        height:34px;
        margin:0 auto;
        background-color: #5FB878;
        color:white;
    }
    .form_div .radio-inline{
        width:25%;
        height:34px;
    }
    .remember
    {
        width:70%;
        margin:0 auto;
        margin-left:25%;
        /*text-align:center;*/
    }

</style>

<body>
<div class="nav1"><img src="./imgs/logo.png" alt=""></div>
<div class="div1">
    <form class="form" action="/login" method="post">
        <div class="form_div">

            <div class="input">
                <input type="text" name="username" placeholder="账号">
            </div>
        </div>

        <div class="form_div">

            <div class="input">
                <input type="password" name="password" placeholder="密码">
            </div>
        </div>
        <div class="form_div">

            <div class="input">
                <input type="text" class="yzm" name="yzm" placeholder="验证码">
                <img src="/code/kaptcha" style="width:85px" id="cap"/>
            </div>
        </div>
        <div class="form_div">
            <div class="remember">
                <input type="checkbox" name="remember-me" checked="true" ><span>两周免登录</span>
            </div>
        </div>



<%--        <div class="form_div" >--%>
<%--            <label class="radio-inline" style="margin-left:60px">--%>
<%--                <input type="radio" name="role" id="inlineRadio1" value="1"> 学生--%>
<%--            </label>--%>
<%--            <label class="radio-inline">--%>
<%--                <input type="radio" name="role" id="inlineRadio2" value="2"> 普通管理员--%>
<%--            </label>--%>
<%--            <label class="radio-inline">--%>
<%--                <input type="radio" name="role" id="inlineRadio3" value="3"> 高级管理员--%>
<%--            </label>--%>
<%--        </div>--%>

        <div class="form_div" >
            <input type="submit" value="登录" id="sub"  >
        </div>
    </form>
</div>
<!-- jQuery (Bootstrap 的所有 JavaScript 插件都依赖 jQuery，所以必须放在前边) -->
<script src="https://cdn.jsdelivr.net/npm/jquery@1.12.4/dist/jquery.min.js" integrity="sha384-nvAa0+6Qg9clwYCGGPpDQLVpLNn0fRaROjHqs13t4Ggj3Ez50XnGQqc/r8MhnRDZ" crossorigin="anonymous"></script>
<!-- 加载 Bootstrap 的所有 JavaScript 插件。你也可以根据需要只加载单个插件。 -->
<script src="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js" integrity="sha384-aJ21OjlMXNL5UyIl/XNwTMqvzeRMZH2w8c5cRVpzpU8Y5bApTppSuUkhZXN0VxHd" crossorigin="anonymous"></script>

<script>
    $(function(){
        $("#cap").click(function(){
            //刷新验证码
            path = $(this).attr("src")+"?"+new Date().getTime();
            $(this).attr("src",path);
        });

    });
</script>
</body>
</html>
